<script type="text/javascript" src="__ADMIN_COMPONENT__/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__ADMIN_COMPONENT__/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript" src="__ADMIN_COMPONENT__/ueditor/lang/zh-cn/zh-cn.js"></script>

<div class="form-group">
    <div class="col-sm-8 col-md-6 col-lg-5 col-xs-12">
        <textarea id="editor" name="content" type="text/plain" style="height:550px;">{$item['content']}</textarea>
    </div>
</div>

<script type="text/javascript">

    //  删除复杂不常用的组件
    // 'toolbars' : [['fullscreen', 'source', 'preview', '|', 'bold', 'italic', 'underline', 'strikethrough', 'forecolor', 'backcolor', '|',
    //         'justifyleft', 'justifycenter', 'justifyright', '|', 'insertorderedlist', 'insertunorderedlist', 'blockquote', 'emotion',
    //         'link', 'removeformat', '|', 'rowspacingtop', 'rowspacingbottom', 'lineheight','indent', 'paragraph','fontfamily', 'fontsize', '|',
    //         'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol',
    //         'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', '|', 'anchor', 'map', 'print', 'drafts']],

    let ueditorOption = {
        'autoClearinitialContent' : false,
        'toolbars' : [
            [
                'source','|',
                'removeformat','fontsize', 'bold', 'forecolor', 'lineheight' ,'|',
                'indent','justifyleft', 'justifycenter', 'justifyright', '|',
                'rowspacingtop', 'rowspacingbottom'
            ]
        ],
        'elementPathEnabled' : false,
        'initialFrameHeight': 550,
        'focus' : false,
        'maximumWords' : 9999999999999
    };
    let opts = {
        type :'image',
        direct : false,
        multiple : true,
        tabs : {
            'upload' : 'active',
            'browser' : '',
            'crawler' : ''
        },
        path : '',
        dest_dir : '',
        global : false,
        thumb : false,
        width : 0,
        fileSizeLimit : 10240000
    };

    // 初始化 系统链接选择
    UE.registerUI('mylink', function(editor, uiName) {
        var btn = new UE.ui.Button({
            name: 'selectUrl',
            title: '系统链接',
            aaa: 'sadasd',
            cssRules: 'background-position: -500px 0;',
            onclick: function() {
                $("#"+this.id).attr({"data-toggle": "selectUrl", "data-callback": "selectUrlCallback"});
            }
        });
        editor.addListener('selectionchange', function() {
            var state = editor.queryCommandState(uiName);
            if (state == -1) {
                btn.setDisabled(true);
                btn.setChecked(false);
            } else {
                btn.setDisabled(false);
                btn.setChecked(state);
            }
        });
        return btn;
    });

    UE.registerUI('myinsertimage',function(editor,uiName){
        editor.registerCommand(uiName, {
            execCommand:function(){
                require(['fileUploader'], function(uploader){
                    uploader.show(function(imgs){
                        if (imgs.length == 0) {
                            return;
                        } else if (imgs.length == 1) {
                            editor.execCommand('insertimage', {
                                'src' : imgs[0]['url'],
                                '_src' : imgs[0]['url'],
                                'width' : '100%',
                                'alt' : imgs[0].filename
                            });
                        } else {
                            var imglist = [];
                            for (i in imgs) {
                                imglist.push({
                                    'src' : imgs[i]['url'],
                                    '_src' : imgs[i]['url'],
                                    'width' : '100%',
                                    'alt' : imgs[i].filename
                                });
                            }
                            editor.execCommand('insertimage', imglist);
                        }
                    }, opts);
                });
            }
        });
        var btn = new UE.ui.Button({
            name: '插入图片',
            title: '插入图片',
            cssRules :'background-position: -726px -77px',
            onclick:function () {
                editor.execCommand(uiName);
            }
        });
        editor.addListener('selectionchange', function () {
            var state = editor.queryCommandState(uiName);
            if (state == -1) {
                btn.setDisabled(true);
                btn.setChecked(false);
            } else {
                btn.setDisabled(false);
                btn.setChecked(state);
            }
        });
        return btn;
    }, 19);

    UE.registerUI('myinsertvideo',function(editor,uiName){
        editor.registerCommand(uiName, {
            execCommand:function(){
                require(['fileUploader'], function(uploader){
                    uploader.show(function(video){
                        if (!video) {
                            return;
                        } else {
                            var videoType = video.isRemote ? 'iframe' : 'video';
                            editor.execCommand('insertvideo', {
                                'url' : video.url,
                                'width' : 300,
                                'height' : 200
                            }, videoType);
                        }
                    }, {fileSizeLimit: 5120000, type: 'video', allowUploadVideo: true, netWorkVideo: true});
                });
            }
        });
        var btn = new UE.ui.Button({
            name: '插入视频',
            title: '插入视频',
            cssRules :'background-position: -320px -20px',
            onclick:function () {
                editor.execCommand(uiName);
            }
        });
        editor.addListener('selectionchange', function () {
            var state = editor.queryCommandState(uiName);
            if (state == -1) {
                btn.setDisabled(true);
                btn.setChecked(false);
            } else {
                btn.setDisabled(false);
                btn.setChecked(state);
            }
        });
        return btn;
    }, 20);


    $(function(){
        let ue = UE.getEditor('editor', ueditorOption);
        $('#editor').data('editor', ue);
        $('#editor').parents('form').submit(function() {
            if (ue.queryCommandState('source')) {
                ue.execCommand('source');
            }
        });
        // 监听内容改变
        ue.addListener('contentChange',function(){
            $("#preview-content").html(ue.getContent());
        });
    });

    // 选择链接 callback
    function selectUrlCallback(href){
        var ue =  UE.getEditor('editor');
        if(href){
            ue.execCommand('link', {href: href});
        }
    }
</script>
